<template>
	
	<scroll-view scroll-y="true" class="index" lower-threshold='200'
		:style="{height:pageHeight==='auto'?'auto':pageHeight+'px'}" @scrolltolower="lower">
		
		<car-card v-for="(item,index) in craneList" :topLine="index!==0" :data="item" :isNew="true" :key="index">
		</car-card>
		
		<view v-if="noMore" class="noMore">没有更多了</view>
	</scroll-view>
</template>

<script>
	import {
		getCraneList,
		collectlist
	} from '@/api/crane.js'
	import carCard from '../../common/carCards.vue'


	export default {
		components: {
			carCard
		},
		data() {
			return {
				craneList: [],
				pageindex: 1,
				pagesize: 20,
				noMore: false,
				pageHeight: 'auto',
				loading: false
			};
		},
		onLoad(options) {
			const _this = this;
			uni.getSystemInfo({
				success: function(e) {
					_this.pageHeight = e.windowHeight;
				}
			})
			_this.getCraneList();
		},
		watch: {

		},
		onShow() {

		},
		onReady() {
			// 加载dom
		},
		methods: {
			getdata(){
				collectlist({
					userid:this.$store.state.app.uid
				}).then(res=>{
					console.log(res)
				})
			},
			getCraneList: function() {
				const _this = this;
				if (_this.loading) {
					return
				}
				this.pageindex === 1 && uni.showLoading({
					title: '加载中···'
				});
				_this.loading = true;
				collectlist({
					userid:this.$store.state.app.uid
				}).then(res=>{
					console.log(res)
					_this.craneList=res.data
					
				}).finally(() => {
					uni.hideLoading();
					setTimeout(() => {
						_this.loading = false;
					}, 500)
				})
			},
			lower: function() {
				if (this.loading) {
					return
				}
				this.pageindex += 1;
				this.getCraneList();
			}
		}
	};
</script>

<style lang="scss">
	.index {
		box-sizing: border-box;
		padding: 6upx 0;
		background: #FFFFFF;
		height: 100%;

		.noMore {
			margin: 30upx 0;
			text-align: center;
			font-size: 24upx;
			color: #999999;
		}
	}
</style>
